<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>
    <Script>
        //遍历事件
        function test(){
            let lis=document.querySelectorAll('li')
       // console.log(lis)
        for(let i=0;i<lis.length;i++){
            lis[i].addEventListener('click',function(){
                
                console.log(this.innerText)
            })
        }

        }
        test()
      //事件委托
      function test2(){
          let ul=document.querySelector('ul')
            ul.addEventListener('click',function(e){
                e=e||window.event
                var target=e.target||e.srcElement
                if(e.target.innerText=='1'){
                    console.log(1)
                }
                if(e.target.innerText=='2'){
                    console.log(2)
                }
                if(e.target.innerText=='3'){
                    console.log(3)
                }
                if(e.target.innerText=='4'){
                    console.log(4)
                }
                
            })
          
      }
      test2()

        
    </Script>
</body>
</html>